<template>
    <n-config-provider abstract :breakpoints="breakpoints" :theme="UseConfig().theme == 'light' ? lightTheme : darkTheme" :theme-overrides="themeOverrides" :locale="zhCN" :date-locale="dateZhCN">
        <n-global-style />
        <n-message-provider>
            <n-dialog-provider>
                <n-notification-provider>
                    <div class="w-full h-full box-border overflow-hidden">
                        <slot />
                    </div>
                </n-notification-provider>
            </n-dialog-provider>
        </n-message-provider>
    </n-config-provider>
</template>

<script lang="ts" setup>
import {computed} from 'vue'
import UseConfig from '@/store/module/config'
import {darkTheme, dateZhCN, lightTheme, NConfigProvider, NDialogProvider, NGlobalStyle, NMessageProvider, NNotificationProvider, zhCN} from 'naive-ui'

const breakpoints = computed(() => {
    return {
        xs: 0,
        s: 640,
        m: 768,
        l: 1024,
        xl: 1280,
        xxl: 1536
    }
})
const themeOverrides = computed(() => {
    return {
        common: {
            'borderRadius': '0',
            //主色
            'primaryColor': '#2080f0',
            'primaryColorHover': '#4098fc',
            'primaryColorPressed': '#1060c9',
            'primaryColorSuppl': '#4098fc',
            //信息色
            'infoColor': '#18a058',
            'infoColorHover': '#36ad6a',
            'infoColorPressed': '#0c7a43',
            'infoColorSuppl': '#36ad6a',
            //成功色
            'successColor': '#18a058',
            'successColorHover': '#36ad6a',
            'successColorPressed': '#0c7a43',
            'successColorSuppl': '#36ad6a',
            //警告
            'warningColor': '#f0a020',
            'warningColorHover': '#fcb040',
            'warningColorPressed': '#c97c10',
            'warningColorSuppl': '#fcb040',
            //错误
            'errorColor': '#d03050',
            'errorColorHover': '#de576d',
            'errorColorPressed': '#ab1f3f',
            'errorColorSuppl': '#de576d'
        },
        Tabs: {
            'tabTextColorBar': '#444444ff',
            'tabTextColorActiveBar': '#3171ffff',
            'tabTextColorHoverBar': '#3171ffff'
        }
    }
})
</script>
